<template>
  <main class="supplier-system">
    <div class="min-pc-width system">
      <p class="header"><span>第2页</span></p>
      <!-- <a-form :form="form" @submit="handleSubmit"> -->
      <a-form :form="form" @submit="handleSubmit">
        <a-form-item label="科技成果名称" class="form-item mt60">
          <a-input v-decorator="['kgcgmch',{ initialValue: formData.kgcgmch || '' ,rules: [{ required: true, message: '科技成果名称不能为空!' }]}]" placeholder="科技成果名称" autocomplete="off" />
        </a-form-item>
        <a-form-item label="研究起始时间" class="form-item">
          <a-date-picker  v-decorator="['yjqishisj',{ initialValue: formData.yjqishisj || '' , rules: [{ required: true, message: '起始时间不能为空!' }]}]"  placeholder="研究起始时间" style="width: 100%" />
        </a-form-item>
        <a-form-item label="研究终止时间" class="form-item">
          <a-date-picker  v-decorator="['yjjieshusj',{ initialValue: formData.yjjieshusj || '' , rules: [{ required: true, message: '终止时间不能为空!' }]}]"  placeholder="研究终止时间" style="width: 100%" />
        </a-form-item>
        <div class="split">
          <span class="line"></span>
          <span class="text">申请评价单位</span>
          <span class="line"></span>
        </div>
        <a-form-item label="单位名称" class="form-item">
          <a-input v-decorator="['dwmch',{ initialValue: formData.dwmch || '' , rules: [{ required: true, message: '单位名称不能为空!' }]}]" placeholder="单位名称" autocomplete="off" />
        </a-form-item>
        <p class="content mt20">所在地区 </p>
        <!-- <a-form-item label="所在地区" class="form-item">
          <a-input v-decorator="['szdq',{ initialValue: formData.szdq || ''}]" placeholder="所在地区" autocomplete="off" />
        </a-form-item> -->
        <a-form-item label="代码" class="form-item">
          <a-input v-decorator="['dqcode',{ initialValue: formData.dqcode || ''}]" placeholder="代码" autocomplete="off" />
        </a-form-item>
        <a-form-item label="名称" class="form-item">
          <a-input v-decorator="['dqmch',{ initialValue: formData.dqmch || ''}]" placeholder="名称" autocomplete="off" />
        </a-form-item>
        <a-form-item label="联系人" class="form-item">
          <a-input v-decorator="['lxren',{ initialValue: formData.lxren || '' , rules: [{ required: true, message: '联系人不能为空!' }]}]" placeholder="联系人" autocomplete="off" />
        </a-form-item>
        <a-form-item label="单位属性" class="form-item">
          <a-select v-decorator="['dwsx',{ initialValue: formData.dwsx || '1' , rules: [{ required: true, message: 'Please select your gender!' }] }]" placeholder="单位属性" >
            <a-select-option value="1">建筑安装单位</a-select-option>
            <a-select-option value="2">科研单位及大专院校</a-select-option>
            <a-select-option value="3">制造企业</a-select-option>
            <a-select-option value="4">集体个体</a-select-option>
            <a-select-option value="5">其他</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="邮政编码" class="form-item">
          <a-input v-decorator="['yzbianma',{ initialValue: formData.yzbianma || '' }]" placeholder="邮政编码" autocomplete="off" />
        </a-form-item>
        <a-form-item label="联系电话" class="form-item">
          <a-input v-decorator="['lxdianhua',{ initialValue: formData.lxdianhua || '' , rules: [{ required: true, message: '联系电话不能为空!' }]}]" placeholder="联系电话" autocomplete="off" />
        </a-form-item>
        <a-form-item label="通信地址" class="form-item">
          <a-input v-decorator="['txdizhi',{ initialValue: formData.txdizhi || ''}]" placeholder="通信地址" autocomplete="off" />
        </a-form-item>
        <a-form-item label="任务来源" class="form-item">
          <a-select v-decorator="['rwly',{ initialValue: formData.rwly || '1' , rules: [{ required: true, message: 'Please select your gender!' }] }]" placeholder="单位属性">
            <a-select-option value="1">国家计划</a-select-option>
            <a-select-option value="2">省部计划</a-select-option>
            <a-select-option value="3">集团计划</a-select-option>
            <a-select-option value="4">计划外</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="成果有无密级" class="form-item">
          <a-select v-decorator="['cgmj',{ initialValue: formData.cgmj || '0' , rules: [{ required: true, message: 'Please select your gender!' }] }]" placeholder="单位属性">
            <a-select-option value="1">有</a-select-option>
            <a-select-option value="0">无</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="密级" v-if="form.getFieldValue('cgmj')==1" class="form-item">
          <a-select v-decorator="['mj',{  initialValue: formData.mj || '1' ,rules: [{ required: true, message: 'Please select your gender!' }] }]" placeholder="单位属性" >
            <a-select-option value="1">秘密</a-select-option>
            <a-select-option value="2">机密</a-select-option>
            <a-select-option value="3">绝密</a-select-option>
          </a-select>
        </a-form-item>
        <div class="split">
          <span class="line"></span>
          <span class="text">成果简介</span>
          <span class="line"></span>
        </div>
        <a-form-item label="" class="form-item">
          <a-textarea  v-decorator="['cgjianjie',{  initialValue: formData.cgjianjie || ''}]" placeholder="150字以内" :rows="10" autocomplete="off" />
        </a-form-item>
        <div class="supplier-footer">
          <a-button @click="goBack" class="s-btn">
            返回
          </a-button>
          <a-button html-type="submit"  class="s-btn"  @click="save">
          <!-- <a-button html-type="submit" class="s-btn"> -->
            保存
          </a-button>
          <a-button @click="resetForm" class="s-btn">
            重填
          </a-button>
          <a-button  html-type="submit"  type="primary" @click="goNext" class="s-btn">
            继续
          </a-button>
        </div>
    </a-form>
    </div>
  </main>
</template>
<script>
export default {
  data () {
    return {
      currentIndex: 0,
      form: this.$form.createForm(this),
      formId: '',
      formData: '',
      type: 0
    }
  },
  components: {
  },
  computed: {
  },
  created () {
    if (this.$route.query.id) {
      this.formId = this.$route.query.id
      this.getKJCXFormDataById()
    }
  },
  methods: {
    goBack () {
      this.$router.push({ path: `/innovation/supplier/1?id=${this.formId}` })
    },
    goNext () {
      this.type = 1
    },
    save () {
      this.type = 0
    },
    getKJCXFormDataById () {
      this.$http.queryCgjdForm({ id: this.formId }).then(res => {
        this.formData = res.data
      })
    },
    memberStepForm (values) {
      this.$http.persistCgjdForm(Object.assign(values, {
        id: this.formId
      })).then(res => {
        this.formId = res.data.id
        if (this.type == 1) {
          this.$router.push({ path: `/innovation/supplier/3?id=${res.data.id}` })
        }
      })
    },
    handleChange (info, key) {
      if (info.file.status === "done") {
        this.file[key] = info.file.response.fileName
      } else if (info.file.status === "error") {
        this.$message.error(`${info.file.name} file upload failed.`)
      }
    },
    handleSubmit (e) {
      let _this = this
      e.preventDefault()
      this.form.validateFields((err, values) => {
        if (!err) {
          _this.memberStepForm(values)
        }
      })
    },
    resetForm () {
      this.form.resetFields()
    }
  }
}
</script>
<style lang="scss">
</style>
